// out:../css/login.css
// 配置转换样式的指定路径

@import url(./var.less);

// 设置根元素比例值
html {
  font-size: 100px;
  overflow: hidden;
}

// 公共样式
.hide {
  display: none;
}

input {
  border: 0;
  outline: none;
}
//1、 初始化加载页
.load {
  width: 100%;
  height: 100vh;
  background: url(../images/load.png) no-repeat;
}
//2、 登录页
.login {
  width: 100%;
  // background-color: orange;
  margin: 0 auto;
  padding: 0 0.16rem;
  margin-top: 0.53rem;
  .tel {
    .nav {
      width: 0.72rem;
      height: 0.25rem;
      font-weight: 600;
      font: size 0.18rem;
      color: #2a2929;
      letter-spacing: 0;
      margin: auto;
    }
    .header {
      width: 100%;
      height: 0.35rem;
      padding: 0.02rem 0.01rem;
      // background-color: red;
      display: flex;
      font-family: PingFangSC-SNaNpxibold;
      justify-content: space-between;
      align-items: center;
      margin-top: 0.5rem;
      font-size: 0.2rem;
      font-weight: 600;

      .telRight {
        font-size: 0.12rem;
        color: @brand_color;
        position: relative;
        &::after {
          content: "";
          background-image: url(../images/路径\ 5.png);
          position: absolute;
          top: 0.03rem;
          // right: -0.15rem;
          width: 0.1rem;
          height: 0.1rem;
        }
      }
    }

    .formTel {
      width: 100%;
      height: 1.05rem;
      margin-top: 0.4rem;
      // background-color: orange;
      display: flex;
      flex-direction: column;
      position: relative;

      .telNum,
      .telPassword {
        height: 0.5rem;
        width: 3.1rem;
        border: 0;
        border-bottom: 0.01rem solid @form_border;
        padding: 0.1rem 0;
      }

      .telNum:focus,
      .telPassword:focus {
        border: 0;
        border-bottom: 0.01rem solid @form_border;
      }

      .telCode {
        position: absolute;
        top: 0.7rem;
        right: 0.25rem;
        height: 0.2rem;
        font-weight: 500;
        font-size: 0.08rem;
        line-height: 0.2rem;
        color: @black;
        display: flex;
        .clearHide {
          width: 0.2rem;
          height: 0.2rem;
          margin-left: 0.1rem;
          object-fit: cover;
        }
      }
      .stopTel {
        display: flex;
        justify-content: center;
      }

      .telNotice,
      .validationMessage {
        padding-top: 0.05rem;
        color: @error;
        font-size: 0.12rem;
      }
    }

    .telBtn {
      width: 100%;
      height: 0.5rem;
      background-color: #fadcd9;
      border-radius: 0.25rem;
      margin-top: 0.5rem;
      font-size: 0.18rem;
      border: 0.01rem solid @form_border;
      color: @white;
    }
  }
  // 3、这遮罩层
  .mask {
    position: absolute;
    margin: 0 auto;
    top: 6.485rem;
    width: 0.57rem;
    height: 0.5rem;
    font-weight: 400;
    font-size: 0.14rem;
    color: #ffffff;
    // letter-spacing: 0.16px;
    text-align: center;
    background-color: orange;
  }
}
